<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<c:set var="tabmode" value="${empty cookie.tabmode.value ? '1' : cookie.tabmode.value}" />
<html>
<head>
    <title>潜在客户详细信息${vo.corporationName}</title>
    <meta name="decorator" content="default" />
    <link rel="stylesheet" href="${ctxStatic}/bootstrap-table/bootstrap-table.css">
    <script src="${ctxStatic}/bootstrap-table/bootstrap-table.js"></script>
    <script src="${ctxStatic}/bootstrap-table/locale/bootstrap-table-zh-CN.js"></script>
    <script src="${ctxStatic}/bootstrap-table/config.js"></script>
    <script src="${ctxStatic}/common/player.js"></script>
    <script type="application/javascript" src="${ctxStatic}/modules/potentialcustomer/potentialCustomerDetail.js"></script>
    <style type="text/css">
    	.basic-area {width: auto;height: 570px}
    	#basicInfoFrame {height: 100%;width: 100%;border: none;}
    	.modal-header {padding: 8px 15px;}
    	.modal-footer {padding: 8px 15px;}
		/*.control-label{ width: 80px !important;}*/
		/*.form-horizontal .controls{margin-left: 100px;}*/
    </style>
</head>
<body>
	<ul class="nav nav-tabs">
		<li class="active"><a href="#">潜在客户详情</a></li>
	</ul>
	<div style="display: none;" id="dataArea"
     data-potentialCustomerId="${id}" 
     data-flag="${flag}" 
     data-user-id="${fns:getUser().id}" 
     data-base-path="${fns:getConfig('call.record.default.path')}/${fns:getConfig('call.server.vccid')}/"></div>

	<div style="margin:0 20px;width: auto;">
	   <div class="basic-area">
			<iframe id="basicInfoFrame" src="${ctx }/mywork/potentialCustomer/detailBasicInfo?id=${id}&flag=${flag}"></iframe>
		</div>
	    <%-- 销售跟踪 div start--%>
	    <div class="accordion" id="VisitRecordAccordion">
	        <div class="accordion-group">
	            <div class="accordion-heading">
	                <a class="accordion-toggle" data-toggle="collapse" data-target="#collapseOne" data-parent="#accordion2">
	                    <i class="icon-tasks"></i>
	                    销售跟踪
	                </a>
	            </div>
	            <div id="collapseOne" class="accordion-body collapse in">
	                <form id="visitRecordForm" modelAttribute="potentialGroup"
	                      action="" onsubmit="return false"
	                      method="post" class="form-horizontal" style="margin-top:10px;">
	                    <input type="hidden" value="${id}" name="potentialCustomerId" />
	                    <input type="hidden" value="SUCCESS" name="visitRecord.visitResult" id="visitResult" />
	                    <input type="hidden" value="SUCCESS" name="visitRecord.operationType" id="operationType" />
	
	                    <div class="control-group">
	                        <label class="control-label" for="targetProductsId">
	                            产品：
	                        </label>
	                        <div class="controls">
	                            <sys:productType id="targetProductsId" name="targetProducts" withWu="true"
	                                             withAll="false" defaultValue="${vo.targetProducts}"
	                                             cssClass="select-medium" />
	                        </div>
	                    </div>
	                    <div class="control-group">
	                        <label class="control-label" for="customerStatusId">
	                            <span class="warning">*</span> 跟进状态：
	                        </label>
	                        <div class="controls">
	                            <sys:customerStatus id="customerStatusId" name="visitRecord.customerStatusId"
	                                                withAll="false" defaultValue=""
	                                                cssClass="select-medium" />
	                            <select id="customerStatusDetailId" class="select-medium"
	                                    name="visitRecord.customerStatusDetailId"></select>
	                        </div>
	                    </div>
	                    <div class="control-group">
	                        <label class="control-label">跟进记录：</label>
	                        <div class="controls">
	                            <textarea name="visitRecord.visitRecord" style="width: 90%" rows="3" maxlength="120"></textarea>
	                        </div>
	                    </div>
	                    <!-- div class="control-group predictSale">
	                        <label class="control-label"><span class="warning">*</span>预计成单日期：</label>
	                        <div class="controls">
	                            <input readonly="true" type="text" class="input-medium Wdate "
	                                   name="visitRecord.predictSaleDate"
	                                   onmousedown="WdatePicker({dateFmt:'yyyy-MM-dd',minDate:'%y-%M-%d'})" />
	                        </div>
	                    </div>
	                    <div class="control-group predictSale">
	                        <label class="control-label"><span class="warning">*</span>预计金额：</label>
	                        <div class="controls">
	                            <input class="input-medium  digits" name="visitRecord.predictSaleAmount" type="text" data-rule-max="999999999" data-rule-min="0" maxlength="9" />
	                            <span class="add-on">元</span>
	                            <label for="visitRecord.predictSaleAmount" class="error" style="display: none;"></label>
	                        </div>
	                    </div>
	                    <div class="control-group predictSale">
	                        <label class="control-label"><span class="warning">*</span>可能性：</label>
	                        <div class="controls">
	                            <select name="visitRecord.predictSalePercentage" class="select-mini">
	                                <option value="10">10%</option>
	                                <option value="20">20%</option>
	                                <option value="30">30%</option>
	                                <option value="40">40%</option>
	                                <option value="50">50%</option>
	                                <option value="60">60%</option>
	                                <option value="70">70%</option>
	                                <option value="80">80%</option>
	                                <option value="90">90%</option>
	                                <option value="100">100%</option>
	                            </select>
	                        </div>
	                    </div-->
	                    <div class="control-group predictSale">
	                        <label class="control-label">预约提醒：</label>
	                        <div class="controls controls-row">
	                            <span>预约时间</span>
	                            <input readonly="true" type="text" class="input-medium Wdate" name="appointment.appointmentDate"
	                                   onmousedown="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm',opposite:true,minDate:'%y-%M-%d %H:%m'})" />
	                            <span style="margin-left: 30px">将提前</span>
	                            <select class="select-mini" name="appointment.advanceMin">
	                                <option value="15" selected>15</option>
	                                <option value="30">30</option>
	                                <option value="45" >45</option>
	                                <option value="60">60</option>
	                            </select>
	                            <span>分钟，以系统弹窗消息方式提醒</span>
	                            <br />
	                            <br />
	                            <textarea style="width: 90%" rows="3" name="appointment.descn" maxlength="120"> </textarea>
	                        </div>
	                    </div>
	                    <%--成单信息--%>
	                    <div class="control-group done row operation">
	                        <label class="control-label span2">成单产品：</label>
	                        <div class=" span4">
	                            <input htmlEscape="false" class="input-medium" maxlength="36" type="text" id="afterSalesServiceTargetProductsId"
	                                   readonly
	                                   value="${fns:getProductType(vo.targetProducts).productTypeName}" />
	                        </div>
	                        <label class="control-label span2">
	                            <span class="help-inline"><font color="red">*</font> </span>
								成单年限：
	                        </label>
	                        <div class=" span4">
	                            <input name="salesService.year" htmlEscape="false" maxlength="2" type="text"
	                                   class="required input-medium   digits" data-rule-max="50" data-rule-min="1" />
	                        </div>
	                    </div>
	                    <div class="control-group done row operation">
	                        <label class="control-label span2">
	                            <span class="help-inline"><font color="red">*</font> </span>
								成单金额：
	                        </label>
	                        <div class="span4">
	                            <input name="salesService.amount" htmlEscape="false" type="text" class="input-medium  required digits" data-rule-max="999999999" data-rule-min="1" maxlength="9"/>
	                        </div>
	                        <label class="control-label span2">返现：</label>
	                        <div class="span4">
	                            <input name="salesService.backCash" htmlEscape="false" type="text" maxlength="9" class="input-medium  digits " data-rule-max="999999999" data-rule-min="0"/>
	                        </div>
	                    </div>
	                    <div class="control-group done row operation">
	                        <label class="control-label span2">牌匾：</label>
						<div class="span4">
	                            <input name="salesService.board" htmlEscape="false" type="text" maxlength="32" class="input-medium  " />
	                        </div>
	                        <label class="control-label span2">礼品：</label>
	                        <div class="span4">
	                            <input name="salesService.gift" htmlEscape="false" type="text" maxlength="32" class="input-medium  " />
	                        </div>
	                    </div>
	                    <div class="control-group done row operation">
	                        <label class="control-label span2">发票：</label>
	                        <div class="span4">
	                            <input name="salesService.invoice" htmlEscape="false" type="text" maxlength="32" class="input-medium " />
	                        </div>
	                        <label class="control-label span2">电话：</label>
	                        <div class="span4">
	                            <input name="salesService.phone" htmlEscape="false" type="text" maxlength="16" class="input-medium  " data-rule-phone="true" />
	                        </div>
	                    </div>
	                    <div class="control-group done row operation">
	                        <label class="control-label span2">收款人：</label>
	                        <div class="span4">
	                            <input name="salesService.receiver" htmlEscape="false" type="text" maxlength="16" class="input-medium  " />
	                        </div>
	                        <label class="control-label span2">地址：</label>
	                        <div class="span4">
	                            <input name="salesService.address" htmlEscape="false" type="text" maxlength="64" class="input-xlarge  " />
	                        </div>
	                    </div>
	                    <div class="control-group done row operation">
	                        <label class="control-label span2">描述：</label>
	                        <div class="span10">
	                            <input name="salesService.detail" htmlEscape="false" type="text" maxlength="128" class="input-xxlarge " style="width:95%" />
	                        </div>
	                    </div>
	                    <div class="row form-actions">
	                        <div class="span2 create operation">
	                            <input class="btn btn-info" data-operationtype="CREATE"
	                                   data-url="${ctx}/mywork/potentialCustomer/visitRecordCreate" type="button" value="创 建">
	                        </div>
	                        <div class="span2  done operation">
	                            <input class="btn btn-success" data-operationtype="DONE"
	                                   data-url="${ctx}/mywork/potentialCustomer/visitRecordDone" type="button" value="成 单">
	                        </div>
	                        <div class="span2 end operation">
	                            <input class="btn btn-inverse" data-operationtype="END"
	                                   data-url="${ctx}/mywork/potentialCustomer/visitRecordEnd" type="button" value="结 束">
	                        </div>
	                    </div>
	                </form>
	            </div>
	        </div>
	    </div>
	    <%@include file="/WEB-INF/views/modules/customer/potentialcustomer/detail/detailRelatedInfo.jsp" %>
	</div>
	<script type="application/javascript">
	    $(function () {
	    	$(".basic-area",window.parent.document).css("height",document.body.clientHeight);
	        // 成单表单验证
	        $("#visitRecordForm").validate({
	            focusInvalid: true,
	            focusCleanup: true
	        });
	        //客户状态触发
	        $("#customerStatusId").change(function () {
	            customerStatusChange(this);
	        });
	        //目标产品
	        $("#targetProductsId").change(function () {
	            var _targetProName = $(this).find("option:selected").text();
	            $("#afterSalesServiceTargetProductsId").val(_targetProName);
	        });
	        //销售跟踪按钮 事件
	        $(".form-actions .operation .btn").click(function () {
	            if ($("#visitRecordForm").valid()) {
	                var _postUrl = $(this).data("url");
	                $("#operationType").val($(this).data("operationtype"));
	                $.post(_postUrl, $("#visitRecordForm").serialize(), function (data) {
	                    if (data.state) {
							document.getElementById("visitRecordForm").reset();
	                        window.location.reload();
	                    } else {
	                        alertx(data.message);
	                    }
	
	                });
	            }
	
	        });
	
	        //默认初始化第一个
	        customerStatusChange($("#customerStatusId"));
	
	        function customerStatusChange(_this) {
	            var id = $(_this).val();
	            var _operation = $(_this).find("option:selected").attr("data-operation");
	            $(".operation").css("display", "none");
	            if ("DONE" == _operation) {
					$(".control-group.predictSale").css("display","none");// 不显示预计成单
					$(".control-group.predictSale").find("input, select, textarea").attr("disabled", "disabled");// 不验证预计成单
					$(".operation").find("input, select, textarea").not(".btn").removeAttr("disabled");// 成单表单显示
	            } else if("END" == _operation) {
					$(".control-group.predictSale").css("display","none");// 不显示预计成单
	                $(".control-group.predictSale").find("input, select, textarea").attr("disabled", "disabled");// 不验证预计成单
					$(".operation").find("input, select, textarea").not(".btn").attr("disabled", "disabled");// 不验证成单表单
				}else{
					$(".control-group.predictSale").css("display","block");// 显示预计成单
					$(".control-group.predictSale").find("input, select, textarea").removeAttr("disabled");// 验证预计成单
					$(".operation").find("input, select, textarea").not(".btn").attr("disabled", "disabled");// 不验证成单表单

				}
	            if (_operation.trim() != "") {
	                $(".operation." + _operation.toLowerCase()).css("display", "block");
	            }
	
	            if (id) {
	                $.getJSON("${ctx}/sys/customerStatus/selectDetail?type=select&id=" + id, function (data) {
	                    if (data.state == true) {
	                        if (data.list.length > 0) {
	                        	$("#customerStatusDetailId").empty();
								$("#customerStatusDetailId").append("<option value=''>请选择</option>");
	                            $("#customerStatusDetailId").append(data.select);
	                            $("#customerStatusDetailId").show();
	                        } else {
	                            $("#customerStatusDetailId").empty();
								$("#customerStatusDetailId").hide();

	                        }
	                    } else {
	                        alertx(data.message);
	                    }
	                });
	            }
	        }
	    });
	
	
	</script>
</body>
</html>